<template>
  <!-- <div class="container-app" :class="header.title ? `item-padding-top` : ``"> -->
  <div class="container-app">
    <layerHeader />
    <div v-if="false" id="nav" class="item-nav">
      <router-link to="/">首页</router-link>
      <router-link to="/productDetails">商品详情</router-link>
      <router-link to="/type">分类</router-link>
      <router-link to="/cart">购物车</router-link>
      <router-link to="/my">我的</router-link>
      <router-link to="/address">选择地址</router-link>
      <router-link to="/addAddress">增加地址</router-link>
      <router-link to="/allOrder">全部订单</router-link>
      <router-link to="/submitOrder">提交订单</router-link>
      <router-link to="/buySucc">购买成功</router-link>
      <router-link to="/serachProduct">搜索</router-link>
      <router-link to="/searchPage">搜索结果</router-link>
    </div>
    <router-view />
  </div>
</template>
<script>
import { mapGetters } from 'vuex'
import layerHeader from '@/components/header'
export default {
  components: {
    layerHeader
  },
  data() {
    return {}
  },
  computed: {
    ...mapGetters(['header'])
  },
  created() {
    console.log()
    if (this.getQueryVariable('token')) {
      localStorage.setItem('token', this.getQueryVariable('token'))
      window.location.href = 'http://amall.unmcc.com/#/home'
      // window.location.href = 'http://192.168.8.107:8081/#/home'
      // alert('登录成功')
    } else {
      if (!localStorage.getItem('token')) {
        console.log(404)
        // alert('登录失败')
      }
    }
  },
  methods: {
    getQueryVariable: function getQueryVariable(variable) {
      const query = window.location.search.substring(1)
      const vars = query.split('&')
      for (let i = 0; i < vars.length; i++) {
        const pair = vars[i].split('=')
        if (pair[0] === variable) {
          return pair[1]
        }
      }
      return false
    }
  }
}
</script>

<style lang="less">
.container-app {
  .item-nav {
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 748943649;
    overflow: scroll;
    white-space: nowrap;
    opacity: 0.5;
    background-color: #f45050;
    * {
      padding: 3px 5px;
      color: #fff;
    }
  }
  .item {
    &-btn {
      white-space: nowrap;
    }
    &-btn-normal {
      color: #666;
    }
    &-btn-active {
      color: #d63a54;
    }
    &-btn-disabed {
      position: relative;
      color: #999;
      &::before {
        content: "";
        display: block;
        width: 100%;
        height: 1px;
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        background: #999;
      }
    }
  }
}
</style>

<style>
body {
  width: 100vw;
  margin: 0;
  overflow-x: hidden;
  font-family: "微软雅黑";
  background: #f5f6f8;
}
* {
  box-sizing: border-box;
}
img {
  max-width: 100%;
}
</style>
